<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="./css/index.css"/>
	</head>
	<body>
		<div class="top-header">
			<a href="register.html" class="top-item" style="color: #888888;">注册</a>
			<a href="login.html" class="top-item" style="color: #888888;">登录</a>
		</div>
		<div class="bottom-header">
			<div class="bottom-content">
				<div style="flex: 1;">
					<a href="index.html">
						<img src="img/logo.gif" width="157" height="50" >	
					</a>
				</div>
				<div style="flex: 2;text-align: center;">
					<input type="text" placeholder="请输入查询关键词" class="input"/>
					<button type="button" class="btn">搜索</button>
				</div>
				<div class="cart-btn" style="flex: 1;text-align: right;position: relative;">
					<a href="">
						<img src="img/Shopping-cart-1@3x.png" width="20" height="20">
					</a>
					<div class="cart-box">
						<h3>购物车</h3>
						<div style="display: flex;align-items: center;">
							<div style="padding: 0px 10px;">
								<img src="img/9.jpg" width="50" height="50" >
							</div>
							<div style="font-size: 12px;">
								<p class="text-hidden">
									<span style="color: red;">1</span><span>寻真水果 山东烟台西夏红富士苹果16-24个 5kg 新鲜水果
									</span>
								</p>
								<p style="text-align: left;color: red;">0.7</p>
							</div>
						</div>
						<div class="cart-bottom">
							<div class="left">
								<span>共：￥0.73</span>
							</div>
							<div class="right">
								<span>查看购物车</span>
							</div>
						</div>
					</div>

				</div>
			</div>
		</div>
		<div style="padding-top: 40px;display: flex;">
			<ul class="menu">
				<li class="menu-item">
					<img src="img/fl.png" style="width: 15;height: 15;">
					<span>分类</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>电子类</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>男装</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>家具</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>新分类</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>蔬菜类</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>肉禽类</span>
				</li>
				<li class="menu-item">
					<img src="img/dw.png" style="width: 15;height: 15;">
					<span>鞋子</span>
				</li>
			</ul>
			<div class="main">
				<p style="font-size: 14px;">水果类</p>
				<hr style="margin: 30px 0;color: #ddd;opacity: .2;">
				<img src="img/yh.png" style="opacity: .6;width: 30;height: 30;position: relative;top: -49px;left:45% ;">
				<ul class="product">
					<li class="product-item">
						<div class="product-img">
							<a href="">
								<img src="img/1.jpg" width="100%" height="220px">
							</a>
							<div class="addWish">
								<img src="love.png" style="height: 25;width: 25;">
							</div>
						</div>
						<div class="product-text">
							<b>火龙果火龙果火龙果火龙果火龙果火龙果火龙果火龙果火龙果火龙果</b>
							<div style="margin-top: 10px;">
								<span style="text-decoration: line-through;">￥1.3</span>
								<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
							</div>
						</div>
					</li>
					<li class="product-item">
						<div class="product-img">
							<a href="">
								<img src="img/2.jpg" width="100%" height="220px">
							</a>
							<div class="addWish">
								<img src="love.png" style="height: 25;width: 25;">
							</div>
						</div>
						<div class="product-text">
							<b>苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果苹果</b>
							<div style="margin-top: 10px;">
								<span style="text-decoration: line-through;">￥1.3</span>
								<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
							</div>
						</div>
					</li>
					<li class="product-item">
						<div class="product-img">
							<a href="">
								<img src="img/3.jpg" width="100%" height="220px">
							</a>
							<div class="addWish">
								<img src="love.png" style="height: 25;width: 25;">
							</div>
						</div>
						<div class="product-text">
							<b>百香果百香果百香果百香果百香果百香果百香果百香果百香果百香果</b>
							<div style="margin-top: 10px;">
								<span style="text-decoration: line-through;">￥1.3</span>
								<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
							</div>
						</div>
					</li>
					<li class="product-item">
						<div class="product-img">
							<a href="">
								<img src="img/4.jpg" width="100%" height="220px">
							</a>
							<div class="addWish">
								<img src="love.png" style="height: 25;width: 25;">
							</div>
						</div>
						<div class="product-text">
							<b>石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴石榴</b>
							<div style="margin-top: 10px;">
								<span style="text-decoration: line-through;">￥1.3</span>
								<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
							</div>
						</div>
					</li>
				<li class="product-item">
					<div class="product-img">
						<a href="">
							<img src="img/5.jpg" width="100%" height="220px">
						</a>
						<div class="addWish">
							<img src="love.png" style="height: 25;width: 25;">
						</div>
					</div>
					<div class="product-text">
						<b>糖心苹果糖心苹果糖心苹果糖心苹果糖心苹果糖心苹果糖心苹果糖心苹果</b>
						<div style="margin-top: 10px;">
							<span style="text-decoration: line-through;">￥1.3</span>
							<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
						</div>
					</div>
				</li>
				<li class="product-item">
					<div class="product-img">
						<a href="">
							<img src="img/6.jpg" width="100%" height="220px">
						</a>
						<div class="addWish">
							<img src="love.png" style="height: 25;width: 25;">
						</div>
					</div>
					<div class="product-text">
						<b>大红枣大红枣大红枣大红枣大红枣大红枣大红枣大红枣大红枣大红枣大红枣</b>
						<div style="margin-top: 10px;">
							<span style="text-decoration: line-through;">￥1.3</span>
							<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
						</div>
					</div>
				</li>
				<li class="product-item">
					<div class="product-img">
						<a href="">
							<img src="img/7.jpg" width="100%" height="220px">
						</a>
						<div class="addWish">
							<img src="love.png" style="height: 25;width: 25;">
						</div>
					</div>
					<div class="product-text">
						<b>柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子柚子</b>
						<div style="margin-top: 10px;">
							<span style="text-decoration: line-through;">￥1.3</span>
							<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
						</div>
					</div>
				</li>
				<li class="product-item">
					<div class="product-img">
						<a href="">
							<img src="img/8.jpg" width="100%" height="220px">
						</a>
						<div class="addWish">
							<img src="love.png" style="height: 25;width: 25;">
						</div>
					</div>
					<div class="product-text">
						<b>梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子梨子</b>
						<div style="margin-top: 10px;">
							<span style="text-decoration: line-through;">￥1.3</span>
							<span style="font-size: 20px;font-weight: 700;">￥1.0</span>
						</div>
					</div>
				</li>
								
				</ul>
			</div>
		</div>
		<div class="footer">
			<p>全国高职院校web应用软件开发技能竞赛</p>
		</div>
	</body>
</html>
